<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>ShowDisaster</title>
    <link rel="stylesheet" href="/Trees/LayUiBac/layui/css/layui.css" media="all">
</head>
<body>

<div class="layui-container">
    <div class="layui-row">
        <h1>事件信息</h1>
        <form class="layui-form" action="">

            <div class="layui-form-item">
                <label class="layui-form-label">事件名称</label>
                <div class="layui-input-block">
                    <input type="text" name="thingName" required lay-verify="required"
                           autocomplete="off" class="layui-input">
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">发生时间</label>
                <div class="layui-input-block">
                    <input type="text" name="time" required lay-verify="required"
                           autocomplete="off" class="layui-input">
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">灾情阶段</label>
                <div class="layui-input-block">
                    <select name="state" id="state" lay-verify="required">
                        <option value="已经控制" selected>已经控制</option>
                        <option value="防治中">防治中</option>
                        <option value="需求专家">需求专家</option>
                    </select>
                </div>
            </div>


            <div class="layui-form-item">
                <label class="layui-form-label">灾情描述</label>
                <div class="layui-input-block">
                    <input type="text" name="describe" required lay-verify="required"
                           autocomplete="off" class="layui-input">
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">灾害类型</label>
                <div class="layui-input-block">
                    <input type="text" name="type" required lay-verify="required"
                           autocomplete="off" class="layui-input">
                </div>
            </div>


            <div class="layui-form-item">
                <label class="layui-form-label">初步损失</label>
                <div class="layui-input-block">
                    <input type="text" name="lose" required lay-verify="required"
                           autocomplete="off" class="layui-input">
                </div>
            </div>


            <div class="layui-form-item">
                <label class="layui-form-label">目前方案</label>
                <div class="layui-input-block">
                    <input type="text" name="method" required lay-verify="required"
                           autocomplete="off" class="layui-input">
                </div>
            </div>

            <!--            <div class="layui-form-item">-->
            <!--                <label class="layui-form-label">专家建议</label>-->
            <!--                <div class="layui-input-block">-->
            <!--                    <input type="text" name="expertMethod" required lay-verify="required"-->
            <!--                           autocomplete="off" class="layui-input">-->
            <!--                </div>-->
            <!--            </div>-->

            <div class="layui-form-item">
                <label class="layui-form-label">发现途径</label>
                <div class="layui-input-block">
                    <input type="text" name="found" required lay-verify="required"
                           autocomplete="off" class="layui-input">
                </div>
            </div>


            <div class="layui-form-item">
                <label class="layui-form-label">发生位置</label>
                <div class="layui-input-block">
                    <input type="text" name="area" required lay-verify="required"
                           autocomplete="off" class="layui-input">
                </div>
            </div>


            <div class="layui-form-item">
                <label class="layui-form-label">影响面积</label>
                <div class="layui-input-block">
                    <input type="text" name="size" required lay-verify="required"
                           autocomplete="off" class="layui-input">
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">所在小班</label>
                <div class="layui-input-block">
                    <input type="text" name="className" required lay-verify="required"
                           autocomplete="off" class="layui-input">
                </div>
            </div>
        </form>

        <table id="demo" lay-filter="meetTable"></table>

    </div>
</div>


<script src="/Trees/LayUiBac/layui/layui.js"></script>
<script>
    //Demo
    layui.use('form', function () {
        let form = layui.form;

        //监听提交
        form.on('submit(formDemo)', function (data) {
            layer.msg(JSON.stringify(data.field));
            return false;
        });
    });
</script>

<script>
    // layui.use('table', function () {
    //     let $ = layui.$;
    //     let layer = layui.layer;
    //     let table = layui.table;
    //     //第一个实例
    //     let show = table.render({
    //         elem: '#demo'
    //         , url: '/Trees/area' //数据接口
    //         , page: true //开启分页
    //         , parseData: function (res) { //res 即为原始返回的数据
    //             return {
    //                 "code": 0, //解析接口状态
    //                 "count": res.total, //解析数据长度
    //                 "data": res.list
    //             };
    //         }
    //         , cols: [[ //表头
    //             {field: 'pkId', title: 'ID', fixed: 'left'}
    //             , {field: 'name', title: '区域名称'}
    //             , {field: 'tree', title: '林种'}
    //             , {field: 'land', title: '地类'}
    //             , {field: 'treetype', title: '优势树种'}
    //             , {
    //                 field: 'className', title: '负责小班', templet: function (d) {
    //                     return d.tClass.className;
    //                 }
    //             }
    //         ]]
    //     });
    // });
</script>
</body>
</html>